<template>
		<view class="content">
				<view class='home'>
					<swiper indicator-dots circular autoplay interval=3000>
						<swiper-item v-for="(item,index) in swipers" :key="index">
							<image :src="item"></image>
						</swiper-item>
						<!-- <swiper-item>2</swiper-item> -->
					</swiper>
				</view>
				<view class="modular">
					<view class="WangHongda" @click="WangHongda()">
						<image src="../../static/YunCangImg/11@3x.png"></image>
						<text>
							<span>网红达人</span>
							<span class='modular_span'>自媒体玩家</span>
						</text>
					</view>
					<view class="MeetingBooking" @click="Meeting()">
						<image src="../../static/YunCangImg/12@3x.png"></image>
						<text>
							<span>会务预约</span>
							<span class='modular_span'>提前预约会议室</span>
						</text>
					</view>
					<view class="DisplayRack" @click="DisplayRack()">
						<image src="../../static/YunCangImg/13@3x.png"></image>
						<text>
							<span>展架</span>
							<span class='modular_span'>购买广告位</span>
						</text>
					</view>
				</view>
		</view>
</template>

<script>
	export default {
		data() {
			return {
			}
		},
		onLoad() {
			//模拟ajax获取数据，uni.request({...});注意回调的this指向
			this.swipers=['https://app-file.beitaichufang.com/img/H5/web/banner/banner20.jpg',
						"https://app-file.beitaichufang.com/img/H5/web/banner/banner21.jpg",
						"https://app-file.beitaichufang.com/img/H5/web/banner/banner22.jpg",
						"https://app-file.beitaichufang.com/img/H5/web/banner/banner23.jpg"
						];
		},
		methods: {
			 WangHongda(){
			        uni.navigateTo({
			         // ? 后面加要传的参数， 多个参数用 & 隔开 
			           url: './WangHongda/WangHongda'
			       })         
		        },
			Meeting(){
				uni.navigateTo({
					url:'./MeetingBooking/MeetingBooking'
				})
			},
			DisplayRack(){
				uni.navigateTo({
					url:'./DisplayRack/DisplayRack'
				})
			}
		}
	}
</script>
<style lang="scss">
	.content{
		background: #ccccc;
		.home{
			swiper{
				width: 750rpx;
			}
			
			image{
				width: 100%;
				height: 100%;
			}
		}
		.modular{
			padding: 20upx;
			// border: 1px solid salmon;
			view{
				display:flex;
				padding-left:10upx;
				text-align: center;
				vertical-align:middle;
				background: #FFFFFF;
				box-shadow: 0px 4px 34upx 2upx rgba(204, 204, 204, 0.32);
				border-radius: 40upx;
				margin-bottom: 20upx;
				color: #333333;
				font-size: 36upx;
				// border: 1px crimson moccasin;
					image{
						width: 231upx;
						height: 231upx;
						display:flex;
						padding-left:5upx;
						text-align: center;
						align-items:center;
					}
					uni-text {
						display: flex;
						align-items:center;
					}
				span{
					display: flex !important;
				}
				.modular_span{
			
					font-size: 30upx;
					font-family: Microsoft YaHei UI;
					font-weight: 400;
					color: #999999;
				}
			}
		}
	}
</style>
